<template>
  <div>
    <van-nav-bar
      title="订单详情"
      left-text="返回"
      left-arrow
      @click-left="$router.go(-1)"
    />
    <div class="flex jc-sa aic f16 box">
      <span>订单已取消</span>
      <img
        src="https://file.sdyxmall.com/h5/v1/public/app/img/cancel.ff91da7.png"
        alt=""
      />
    </div>
    <van-card
      num="2"
      price="2.00"
      desc="描述信息"
      title="商品标题"
      thumb="https://img01.yzcdn.cn/vant/ipad.jpeg"
    />
    <van-cell-group>
      <van-cell title="商品金额" value="￥0.00" />
      <van-cell title="运费" value="￥0.00" />
      <van-cell title="实付" value="￥0.00" />
    </van-cell-group>
    <van-cell-group>
      <van-cell title="商品金额" value="￥0.00" />
      <van-cell title="运费" value="￥0.00" />
      <van-cell title="实付" value="￥0.00" />
    </van-cell-group>
    <van-cell-group>
      <van-cell title="订单状态:已取消" value="重新购买" />
    </van-cell-group>
  </div>
</template>

<script>
export default {
  methods: {},
};
</script>

<style lang="less"  scoped>
.box {
  width: 100%;
  height: 80px;
  background-color: #c03131;
  color: #fff;
  img {
    height: 80px;
    width: 80px;
  }
}
</style>